<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>前端开发工程师笔试题</title>
    <style>
        #span1{
            display: inline-block;  /*块元素*/
            width: 100px;
            height: 100px;
            background-color: gray;
        }
        #span1::after{
            content: '';
            position: absolute;
            left: 72px;
            margin-top: 15px;
            width: 70px;
            height: 70px;
            background-color: gray;
            transform: rotate(45deg);
        }
    </style>
</head>
<body>
    <h1>前端开发工程师笔试题</h1>
    <span>第二题测试1</span>
    <b>第二题测试2</b>
    <br/>
    <!-- 4 -->
    <span id="span1">css练习</span>
    </span>
</body>
<script>
    //1
    var str1=/^[a-zA-Z]\w{5,20}$/
    function checkString(str){
        var boolean=str1.test(str);
        if(boolean){
            return 1;
        }else{
            return 0;
        }
    }
    console.log(checkString("A1234_"));//true
    console.log(checkString("123123"));//false
    //2
    document.onclick=function(){
        var e=(e||event);
        var o=e["target"]||e["srcElement"];
        alert(o.tagName.toLowerCase()); 
    }
    //3
    var s1="abc";
    var s2=new String(s1);
    s1.color="blue";
    s2.color="red";
    console.log(s1===s2,s1.color,s2.color);
    //结果为false,undefined,red
    //原因:s1不是对象不可进行属性赋值,===比较的是地址,所以为false
    //5
    function repeat(func,nums,times){
        return function(t){
            var count=1;
            var xh=setInterval(function(){
                if(count==nums){
                    clearInterval(xh);
                }
                func(t);
                count++;
            },times)
        }
    }
    var a=repeat(alert,6,3000);
    a("你好")
    //6
    //js中可以使用window.onload=function(){}
    //jq中可以使用$(function(){})
    //7
    /*
    const 问题
问题说明：Firefox下，可以使用 const 关键字或 var 关键字来定义常量；IE下，只能使用 var 关键字来定义常量。
解决方案：统一使用 var 关键字来定义常量。
event.srcElement 问题
问题说明：IE下，event 对象有 srcElement 属性，但是没有 target 属性；Firefox下，event 对象有target 属性，但是没有 srcElement 属性。
解决方案：使用 srcObj = event.srcElement ? event.srcElement : event.target;
    */
    //8
    function getMaxAppearCount(str){
        var sz={};
        for(var i=0;i<str.length;i++){
            var p=str.charAt(i);
            if(sz[p]){
                sz[p]++;
            }else{
                sz[p]=1;
            }
        }
        // console.log(sz);
        var max=0;
        var a="";
        for(var j in sz){
            // console.log(sz[j]);
            if(sz[j]>max){
                max=sz[j];
                a=j;
            }
        }
        console.log("最多次数为:"+max+"该字符为:"+a);
    }
    getMaxAppearCount("66666666牛皮可以的niupi")

    //9
    function fibonacci(n) {
    // 声明一个存放数据的数组
    let fibArr = [];
    let fibola="0,";
    // 从第三项(下标为2)开始，每一项都等于前两项之和
    for (let index = 0; index < n; index++) {
        index < 2 ? fibArr.push(1) : fibArr.push(fibArr[index - 1] + fibArr[index - 2]);
        // console.log(fibArr[index]);
        if(index==(n-1)){
            fibola=fibola+fibArr[index];
        }else{
        fibola=fibola+fibArr[index]+",";
        }
    }
    return fibola;
}
// 调用方法
var r1=fibonacci(2);//0,1,1
var r2=fibonacci(6);//0,1,1,2,3,5,8
console.log(r1);
console.log(r2);
//10
/**
 * 前台:座位显示图界面,分为可订，不可订，不可用三种座位，当用户点击可订座位后向后台发送请求添加订单支付成功该座位将
 * 变成不可订,并且订座前会发送请求到后台查询该座位是否已有用户订(保险起见,以防两个用户同时订座,该需求做的不是实时的,所以创建订单之前都要查询判断一下),
 * 如果有请告知用户，没有则继续执行，不可用的座位由后台进行控制，不可用与不可订的座位用户点击无效.
 * 用户进入订座页时会向后台请求数据刷新页面座位详情显示图
 * 后台:拿到前台的请求进行相对应的数据库操作,接收到订座先查询是否该座位已被订返回相应信息给前台,订座后的座位要更改对应的座位
 * 状态,不可用的座位也由后台进行数据操控
 */ 
</script>
</html>